<?php
session_start();
//if(!isset($_SESSION["page"]))
//{
//    $_SESSION["page"] = 0;
//}
?>
<html>
    <head>
        <meta charset="utf-8">
        <title>苍蓝星新闻 </title>
        <link rel="stylesheet" type="text/css" href="./resource/css/indexCSS.css"/>
        <script type="text/javascript" src="resource/js/jquery-1.12.3.min.js"></script>
    </head>
    <body onload="showNews(1)">
<!--    版头-->
        <div id="header" class="header">
            <img src="./resource/img/background/head.jpeg"/>
        </div>
<!--主界面-->
        <div class="main_content">
<!--左侧可点击导航栏-->
            <div class="left_content">
                <div class="left_content_inner">
                    <div>
                        <p>怪猎新闻</p>
                    </div>
                    <ul>
                        <li class="cbutton" onclick="showNews2(1)">热度排行</li>
                        <li class="cbutton" onclick="showNews(1)">苍蓝星社区</li>
                        <li class="cbutton" onclick="showNews3(1)">冰原版本配装</li>
                        <li class="cbutton" onclick="showNews4(1)">RISE最新发布</li>
                    </ul>
                </div>
            </div>
<!--            新闻展示部分-->
            <div class="center_content" id="news">

            </div>
<!--            用户登录注册栏//个人中心栏//轮播图-->
            <div class="right_content">
<!--                个人中心or登录部分-->
                <div class="user">
                    <?php
                    //$userOut="";
                    if(isset($_SESSION["name"]))
                    {
                        //如果session中有name属性则展现登陆后个人中心
                        $userOut=<<<EOF
                             <div class="touxiang">
                                <img src="{$_SESSION['head']}">
                            </div>
                            <div class="huanying">
                                <p>{$_SESSION['name']}</p>
                            </div>
                            
                            <div class="dengluhou_inner">
                                <div class="gerenzhongxin">
                                    <a href="./Personal.php">个人中心</a>
                                </div>
                            <div class="zhuxiao">
                                <a href="./logout.php">注销</a>
                            </div>
                        </div>
EOF;
                    }
                    else {
                        //如果未登录则输出登录表单
                        $userOut = <<<EOF
                        <p>登录</p>
                            <form action="login.php" method="post" id="form">
                                <div class="name_pass">
                                    <label id="name_label">用户名</label>
                                   <input type="text" id="name" name="name"/>
                                </div>
                                <div class="name_pass">
                                    <label id="pass_label">密码</label>
                                    <input type="password" id="password" name="password"/>
                                </div>
                                <div style="text-align: center; padding-top: 10px">
                                    <input type="submit" id="submit" value="登录" name="submit"/>
                                </div>
                            </form>
                            <div style="text-align: center">
                                <a href="zhuce.php">注册</a>
                            </div>
EOF;
                    }
                    //输出EOF缓冲的字段
                    echo $userOut;
                    ?>
                </div>
<!--                轮播图部分-->
                <div class="right_content_more">
                    <ul id="ul">
                        <li style="display: block; width: 100%;">
                            <img src="./resource/news/news1/news1.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news2/news2.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news3/news3.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news4/news4.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news5/news5.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news6/news6.jpeg"/>
                        </li>
                        <li style="display: none; width: 100%;">
                            <img src="./resource/news/news7/news7.jpeg"/>
                        </li>
                    </ul>
                    <div id="all" class="pointAll">
                        <i class="active" onclick="click1()">1</i>
                        <i class="none" onclick="click1()">2</i>
                        <i class="none" onclick="click1()">3</i>
                        <i class="none" onclick="click1()">4</i>
                        <i class="none" onclick="click1()">5</i>
                        <i class="none" onclick="click1()">6</i>
                        <i class="none" onclick="click1()">7</i>
                    </div>
                </div>
            </div>
        </div>

        <!--        轮播图js-->
        <script src="resource/js/LunBoTu.js"></script>
        <script src="resource/js/index_ajax.js"></script>
        <!--表单交互-->
        <script>
            $("#name").bind("focus",function () {
                $("#name_label").css("visibility", "hidden");
            });

            $("#name").bind("blur",function () {
                if ($("#name").val()=="") {
                    $("#name_label").css("visibility", "visible");
                }
            });

            $("#password").bind("focus",function () {
                $("#pass_label").css("visibility", "hidden");
            });

            $("#password").bind("blur",function () {
                if ($("#password").val()=="") {
                    $("#pass_label").css("visibility", "visible");
                }
            });
        </script>
    </body>
</html>